import React from "react";
import { LeftOutline } from "antd-mobile-icons";
import { useNavigate } from "react-router-dom";
const Header = ({ title, right }) => {
  const navigate = useNavigate();
  return (
    <div
      style={{
        height: 46,
        display: "flex",
        justifyContent: "space-between",
        alignItems: "center",
        padding: "0 20px",
        borderBottom: "1px solid #ccc",
        position: "sticky",
        top: 0,
        background: "#fff",
      }}
    >
      <div>
        <LeftOutline onClick={() => navigate(-1)} />
      </div>
      <div>{title}</div>
      <div>{right}</div>
    </div>
  );
};

export default Header;
